import React, { useCallback } from 'react';
import { IAsyncState } from 'hooklib/async';

interface IProps {
  as: IAsyncState,
}
/**
 * 展示一个 async state
 * @param param0
 */
export function ShowAs({ as }: IProps) {
  return (
    <div>
      <pre>{JSON.stringify(as, null, 2)}</pre>
      {as.E && (
        <div>as1.E: {as.E.toString()}</div>
      )}
    </div>
  )
}

interface IPropsAsyncState {
  as: IAsyncState;
  loading?: string;
  fn: Function;
}
export function AsyncState({
  as,
  loading = 'loading',
  fn,
}: IPropsAsyncState) {
  if (as.p) {
    return (<div>{loading}</div>);
  }
  if (as.e) {
    return (<div>{as.m}</div>);
  }
  if (as.o) {
    return fn();
  }
  return (
    <div>no fetch yet</div>
  )
}
